<template>
	<div class="log w944">
		<div class="label_top">
			<p><i class="line"></i>操作日志</p>
		</div>
		<div class="label_table">
			<div class="el-tabs-report">
				<div class="logTime">
					<span>操作时间：</span>
					<el-date-picker v-model="activityStartTime" type="datetime" placeholder="选择开始时间" value-format="yyyy-MM-dd HH:mm:ss" @change="getTableList"></el-date-picker>
					<em>——</em>
					<el-date-picker v-model="activityEndTime" type="datetime" placeholder="选择结束时间" value-format="yyyy-MM-dd HH:mm:ss" @change="getTableList"></el-date-picker>
				</div>
				<div class="msearch">
					<input placeholder="请输入管理员名字、操作模块..." v-model="search"/>
					<a @click="getPageSearch" v-if="log.czrz_search"><img src="../../assets/qudaoImg/search.png"/></a>
				</div>
			</div>
			<el-table ref="multipleTable" :data="tableData" border>
				<el-table-column prop="nickname" label="管理员"></el-table-column>
				<el-table-column prop="pname" label="操作模块"></el-table-column>
				<el-table-column prop="name" label="操作事件"></el-table-column>
				<el-table-column prop="ipAddress" label="IP地址"></el-table-column>
				<el-table-column prop="createTime" label="操作时间"></el-table-column>
			</el-table>
		</div>
		<div class="pag_block" style="margin-top: 15px;">
			<el-pagination @current-change="handleCurrentChange" :current-page="currentpage" :page-size="pagesize" layout="prev, pager, next" :total="total"></el-pagination>
		</div>
	</div>
</template>
<script>
	export default {
		data() {
			return {
				log:'',
				tableData: [],
				activityStartTime:'',
				activityEndTime:'',
				search:'',
				pagesize: 15,
				currentpage: 1,
				total: 1
			}
		},
		methods: {
			getTableList() {
				this.$ajax({
					url: this.$root.jifuUrl + "/getLoggerInfoPage?" + 'page=' + this.currentpage + '&num=' + this.pagesize + '&name=' + this.search + '&starttime=' + this.activityStartTime + '&endtime=' + this.activityEndTime+'&rootcompanyid=1',
					method: 'GET',
					data: {},
					success: res => {
						if(res.data.code == 200) {
							this.tableData = res.data.data.list;
							this.total = res.data.data.pageParam.items;
						}
					}
				});
			},
			handleCurrentChange(value) {
				this.currentpage = value;
				this.getTableList();
			},
			getPageSearch(){
				this.currentpage=1;
				this.getTableList();
			}
		},
		mounted: function() {
			this.getTableList();
			this.log = this.$root.huasan.log;
		}
	}
</script>

<style>
	.log .logTime {display: inline-block;}
	.log .logTime span{font-size: 16px;color: #333;}
	.log .logTime .el-date-editor.el-input,.log .logTime .el-date-editor.el-input__inner{width:177px!important;height: 33px!important;line-height: 33px!important;}
	.log .logTime .el-input__inner{height: 33px!important;line-height: 33px!important;width:177px!important;}
	.log .logTime .el-input--suffix .el-input__inner{padding-right: 0px;}
	.log .logTime .el-input__icon{line-height: 33px;color: #ccc;}
	.log .logTime em{color: #ccc;}
</style>